<template>
  <u-popup
    class="padding"
    custom-style="width:90%"
    :safeAreaInsetBottom="true"
    :safeAreaInsetTop="true"
    :mode="popupData.mode"
    :show="showDetail"
    :round="popupData.round"
    :overlay="popupData.overlay"
    :closeable="popupData.closeable"
    :closeOnClickOverlay="popupData.closeOnClickOverlay"
    @close="close"
  >
    <view class="padding">
      <view class="padding-tb margin-top grid col-1">
        <view
          class="flex-col text-df flex-center"
          v-for="(value, key) in info"
          :key="key"
          :class="{ hide: !langMap[key] }"
        >
          <view class="text-df margin-top text-grey">{{ langMap[key] }}</view>
          <view
            class="text-cut w100 text-center text-bold"
            @click="showInfoToast(value)"
          >
            {{ value || "--" }}
          </view>
        </view>
      </view>

      <u-button
        class="margin-top"
        size="small"
        plain
        type="primary"
        :color="$u.color.primary"
        @click="gotoPlan"
        >查看计划</u-button
      >
    </view>
  </u-popup>
</template>

<script>
const langMap = {
  // account: "",
  // advertiser_id: "",
  // agent_account: "",
  // company_account: "",
  // goods_name: "",
  // goods_thumbnail_url: "",
  // id: "",
  // merchant_id: "",
  // order_create_time: "",
  // order_id: "",
  // order_num: "",
  // order_pay_time: "",
  // order_sn: "",
  // order_status_desc: "状态",
  // pid_account: "",
  // plan_id: "",
  // sale: "",
  // type: "",

  order_sn: "订单号",
  advertiserId: "广告户id",
  plan_id: "计划id",
  goods_name: "商品名称",
  order_status_desc: "订单状态",
  order_create_time: "订单创建时间",
  order_pay_time: "订单支付时间",
  sale: "销售",
};

import { toast } from "@/common/toast.js";
export default {
  props: {
    info: {
      type: Object,
      default() {
        return {};
      },
    },
    showDetail: {
      type: Boolean,
      default: false,
    },
  },

  data() {
    return {
      langMap,
      popupData: {
        closeable: true,
        overlay: true,
        mode: "center",
        round: 10,
        closeOnClickOverlay: true,
      },
    };
  },
  methods: {
    showInfoToast(v) {
      toast({ title: v });
    },
    close() {
      this.$emit("update:showDetail", false);
    },
    gotoPlan() {
      uni.navigateTo({
        url: `/pages/order/sub/plan?plan_id=${this.info.plan_id}`,
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.login {
  width: 100%;
  background-image: url("~@/static/bg.png");
  background-repeat: no-repeat;
  background-size: cover;
}
</style>
